﻿<UserControl x:Class="MetroDemo.ExampleViews.TabControlExamples"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:MetroDemo="clr-namespace:MetroDemo"
             xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls"
             mc:Ignorable="d"
             d:DesignHeight="600"
             d:DesignWidth="800"
             d:DataContext="{d:DesignInstance MetroDemo:MainWindowViewModel}">

    <UserControl.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro.Resources;component/Icons.xaml" />
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>

    <ScrollViewer>
        <StackPanel Margin="5, 10, 5, 0">
            <GroupBox Header="Default TabControl"
                      Margin="0">
                <StackPanel Margin="15, 5, 15, 5">
                    <Label Content="Default TabControl normal style"
                           Style="{DynamicResource DescriptionHeaderStyle}" />
                    <TabControl>
                        <TabItem Header="item 1"
                                 Controls:ControlsHelper.HeaderFontSize="18">
                            <TextBlock FontSize="30"
                                       Text="Content" />
                        </TabItem>
                        <TabItem Header="item 2"
                                 Controls:ControlsHelper.HeaderFontSize="18">
                            <TextBlock FontSize="30"
                                       Text="More content" />
                        </TabItem>
                        <TabItem Header="item 3"
                                 Controls:ControlsHelper.HeaderFontSize="18">
                            <TextBlock FontSize="30"
                                       Text="More more content" />
                        </TabItem>
                        <TabItem Header="item 4"
                                 Controls:ControlsHelper.HeaderFontSize="18">
                            <TextBlock FontSize="30"
                                       Text="So much content!" />
                        </TabItem>
                        <TabItem Header="item 5"
                                 Controls:ControlsHelper.HeaderFontSize="18">
                            <TextBlock FontSize="30"
                                       Text="Content!" />
                        </TabItem>
                        <TabItem Header="item 6"
                                 Controls:ControlsHelper.HeaderFontSize="18">
                            <TextBlock FontSize="30"
                                       Text="This is not content (it is)" />
                        </TabItem>
                    </TabControl>
                    <Label Margin="0, 5, 0, 0"
                           Content="Default TabControl with AnimatedTabControl style"
                           Style="{DynamicResource DescriptionHeaderStyle}" />
                    <Grid>
                        <Grid.Resources>
                            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedTabControl.xaml" />
                        </Grid.Resources>
                        <TabControl>
                            <Controls:MetroTabItem Header="this tabcontrol">
                                <TextBlock FontSize="30"
                                           Text="Cool transition" />
                            </Controls:MetroTabItem>
                            <Controls:MetroTabItem Header="animates its content">
                                <TextBlock FontSize="30"
                                           Text="More cool transition" />
                            </Controls:MetroTabItem>
                            <Controls:MetroTabItem Header="with a transition">
                                <TextBlock FontSize="30"
                                           Text="Animate everything!" />
                            </Controls:MetroTabItem>
                        </TabControl>
                    </Grid>
                    <Label Margin="0, 5, 0, 0"
                           Content="Default TabControl with AnimatedSingleRowTabControl style"
                           Style="{DynamicResource DescriptionHeaderStyle}" />
                    <Grid>
                        <Grid.Resources>
                            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedSingleRowTabControl.xaml" />
                        </Grid.Resources>
                        <TabControl>
                            <TabItem Header="this tabcontrols tabs">
                                <TextBlock FontSize="30"
                                           Text="Content" />
                            </TabItem>
                            <TabItem Header="appear only on a single line">
                                <TextBlock FontSize="30"
                                           Text="Content" />
                            </TabItem>
                            <TabItem Header="if they are overflowing">
                                <TextBlock FontSize="30"
                                           Text="Content" />
                            </TabItem>
                            <TabItem Header="instead of wrapping them">
                                <TextBlock FontSize="30"
                                           Text="Content" />
                            </TabItem>
                        </TabControl>
                    </Grid>
                    <Label Margin="0, 5, 0, 0"
                           Content="Default TabControl left style"
                           Style="{DynamicResource DescriptionHeaderStyle}" />
                    <Grid>
                        <Grid.Resources>
                            <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedSingleRowTabControl.xaml" />
                        </Grid.Resources>
                        <TabControl Margin="0, 10, 0, 0"
                                    TabStripPlacement="Left"
                                    Height="100">
                            <TabItem Header="LeftItem0">
                                <TextBlock FontSize="30"
                                           Text="This is left content 0" />
                            </TabItem>
                            <TabItem Header="LeftItem1">
                                <TextBlock FontSize="30"
                                           Text="This is left content 1" />
                            </TabItem>
                            <TabItem Header="LeftItem2">
                                <TextBlock FontSize="30"
                                           Text="This is left content 2" />
                            </TabItem>
                            <TabItem Header="LeftItem3">
                                <TextBlock FontSize="30"
                                           Text="This is left content 3" />
                            </TabItem>
                            <TabItem Header="LeftItem4">
                                <TextBlock FontSize="30"
                                           Text="This is left content 4" />
                            </TabItem>
                        </TabControl>
                    </Grid>
                    <!--
                                    Right & Bottom are both work, no need to show them all
                                    <TabControl TabStripPlacement="Right" Style="{DynamicResource MetroTabControl}">
                                        <TabItem Header="RightItem0" Content="This is Right content 0" />
                                        <TabItem Header="RightItem1" Content="This is Right content 1" />
                                        <TabItem Header="RightItem2" Content="This is Right content 2" />
                                    </TabControl>
                                    <TabControl TabStripPlacement="Bottom" Style="{DynamicResource MetroTabControl}">
                                        <TabItem Header="BottomItem0" Content="This is Bottom content 0" />
                                        <TabItem Header="BottomItem1" Content="This is Bottom content 1" />
                                        <TabItem Header="BottomItem2" Content="This is Bottom content 2" />
                                    </TabControl>
                                    -->
                </StackPanel>
            </GroupBox>
            <GroupBox Header="Generic theme TabControls"
                      Margin="0, 10, 0, 0">
                <StackPanel Margin="15, 5, 15, 5">
                    <Label Content="MetroAnimatedTabControl"
                           Style="{DynamicResource DescriptionHeaderStyle}" />
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <Controls:MetroAnimatedSingleRowTabControl TabStripPlacement="Left"
                                                                   Height="100">
                            <TabControl.Resources>
                                <Style TargetType="{x:Type TabItem}"
                                       BasedOn="{StaticResource {x:Type TabItem}}">
                                    <Setter Property="HeaderTemplate">
                                        <Setter.Value>
                                            <DataTemplate>
                                                <ContentPresenter Content="{TemplateBinding Content}">
                                                    <ContentPresenter.LayoutTransform>
                                                        <RotateTransform Angle="270" />
                                                    </ContentPresenter.LayoutTransform>
                                                </ContentPresenter>
                                            </DataTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </TabControl.Resources>
                            <TabItem Header="Test1">
                                <TextBlock FontSize="12"
                                           Text="TabStripPlacement Left Test 1" />
                            </TabItem>
                            <TabItem Header="Test2">
                                <TextBlock FontSize="12"
                                           Text="TabStripPlacement Left Test 2" />
                            </TabItem>
                            <TabItem Header="Test3">
                                <TextBlock FontSize="12"
                                           Text="TabStripPlacement Left Test 3" />
                            </TabItem>
                        </Controls:MetroAnimatedSingleRowTabControl>
                        <Controls:MetroAnimatedSingleRowTabControl Grid.Column="1"
                                                                   TabStripPlacement="Right"
                                                                   Height="100">
                            <TabControl.Resources>
                                <Style TargetType="{x:Type TabItem}"
                                       BasedOn="{StaticResource {x:Type TabItem}}">
                                    <Setter Property="HeaderTemplate">
                                        <Setter.Value>
                                            <DataTemplate>
                                                <ContentPresenter Content="{TemplateBinding Content}">
                                                    <ContentPresenter.LayoutTransform>
                                                        <RotateTransform Angle="90" />
                                                    </ContentPresenter.LayoutTransform>
                                                </ContentPresenter>
                                            </DataTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </TabControl.Resources>
                            <TabItem Header="Test1">
                                <TextBlock FontSize="12"
                                           Text="TabStripPlacement Right Test 1" />
                            </TabItem>
                            <TabItem Header="Test2">
                                <TextBlock FontSize="12"
                                           Text="TabStripPlacement Right Test 2" />
                            </TabItem>
                            <TabItem Header="Test3">
                                <TextBlock FontSize="12"
                                           Text="TabStripPlacement Right Test 3" />
                            </TabItem>
                        </Controls:MetroAnimatedSingleRowTabControl>
                    </Grid>
                    <Controls:MetroAnimatedTabControl>
                        <TabItem Header="this tabcontrol">
                            <TextBlock FontSize="30"
                                       Text="Cool transition" />
                        </TabItem>
                        <TabItem Header="animates its content">
                            <TextBlock FontSize="30"
                                       Text="More cool transition" />
                        </TabItem>
                        <TabItem Header="with a transition">
                            <TextBlock FontSize="30"
                                       Text="Animate everything!" />
                        </TabItem>
                    </Controls:MetroAnimatedTabControl>
                    <Label Margin="0, 5, 0, 0"
                           Content="MetroAnimatedSingleRowTabControl"
                           Style="{DynamicResource DescriptionHeaderStyle}" />
                    <Controls:MetroAnimatedSingleRowTabControl>
                        <TabItem Header="this tabcontrols tabs">
                            <TextBlock FontSize="30"
                                       Text="Content" />
                        </TabItem>
                        <TabItem Header="appear only on a single line">
                            <TextBlock FontSize="30"
                                       Text="Content" />
                        </TabItem>
                        <TabItem Header="if they are overflowing">
                            <TextBlock FontSize="30"
                                       Text="Content" />
                        </TabItem>
                        <TabItem Header="instead of wrapping them">
                            <TextBlock FontSize="30"
                                       Text="Content" />
                        </TabItem>
                    </Controls:MetroAnimatedSingleRowTabControl>
                    <Label Margin="0 5 0 0"
                           Content="TabControl w/ Closable Items"
                           Style="{DynamicResource DescriptionHeaderStyle}" />
                    <Controls:MetroTabControl TabItemClosingEvent="MetroTabControl_TabItemClosingEvent">
                        <Controls:MetroTabItem Header="headers"
                                               Controls:ControlsHelper.HeaderFontSize="20"
                                               CloseButtonEnabled="True"
                                               CloseTabCommand="{Binding SingleCloseTabCommand}"
                                               CloseTabCommandParameter="{Binding RelativeSource={RelativeSource Self}, Path=Header}">
                            <TextBlock FontSize="30"
                                       Text="you can bind to a command" />
                        </Controls:MetroTabItem>
                        <Controls:MetroTabItem Header="can"
                                               Controls:ControlsHelper.HeaderFontSize="22"
                                               CloseButtonEnabled="True"
                                               CloseTabCommand="{Binding NeverCloseTabCommand}"
                                               CloseTabCommandParameter="{Binding RelativeSource={RelativeSource Self}, Path=Header}">
                            <TextBlock FontSize="30"
                                       Text="and ensure the command never closes" />
                        </Controls:MetroTabItem>
                        <Controls:MetroTabItem Header="have"
                                               Controls:ControlsHelper.HeaderFontSize="24"
                                               CloseButtonEnabled="True">
                            <TextBlock FontSize="30"
                                       Text="More more content" />
                        </Controls:MetroTabItem>
                        <Controls:MetroTabItem Header="different"
                                               Controls:ControlsHelper.HeaderFontSize="26"
                                               CloseButtonEnabled="True">
                            <TextBlock FontSize="30"
                                       Text="So much content!" />
                        </Controls:MetroTabItem>
                        <Controls:MetroTabItem Header="font"
                                               Controls:ControlsHelper.HeaderFontSize="28"
                                               CloseButtonEnabled="True">
                            <TextBlock FontSize="30"
                                       Text="Content!" />
                        </Controls:MetroTabItem>
                        <Controls:MetroTabItem Header="sizes"
                                               Controls:ControlsHelper.HeaderFontSize="30"
                                               CloseButtonEnabled="True">
                            <TextBlock FontSize="30"
                                       Text="This is not content (it is). This one won't close." />
                        </Controls:MetroTabItem>
                        <Controls:MetroTabItem Header="close button"
                                               Controls:ControlsHelper.HeaderFontSize="36"
                                               CloseButtonEnabled="True">
                            <TextBlock FontSize="24"
                                       Text="The size of close button will be changed proportionately considering its header size." />
                        </Controls:MetroTabItem>
                    </Controls:MetroTabControl>
                </StackPanel>
            </GroupBox>
        </StackPanel>

    </ScrollViewer>

</UserControl>
